<template>
	<div class="drawbody flexcenter">
		<div class="drawbox flexcolumn">
			<div class="flexcolumn gginner">
				<div class="c_000 f16 textcenter mt_10 mb_10">做任务赢取抽奖次数</div>
				<!-- 转发 -->
				<div class="drawimg flexcenter">
					<img :src="`${imgPath}/upload/turnbg/xxcyicon.png`" alt="" />
				</div>
				<div class="f14 c_666 mt_10 textcenter" style="padding: 20px">
					分享给好友，即可获得次数
				</div>

				<div class="flexbetween mt_10">
					<div class="flexcenter detailbtn detailbtn2 mauto c_fff f16" @click.stop="closePop">
						继续抽奖
					</div>
					<button class="flexcenter detailbtn detailbtn2 mauto c_fff f16" open-type="share">分享好友</button>

				</div>
			</div>
		</div>

	</div>
</template>

<script>
	import {
		isExternal
	} from "@/utils/validate";
	import {
		forwardRecord
	} from "@/api/task";
	// import zfshareMixin from "@/mixins/zfshare.js";
	export default {
		// mixins:[ zfshareMixin ],
		data() {
			return {
				imgPath: uni.imgPath,
				isWeixin: true,
				loginType: localStorage.getItem("loginType"),
				isShow: false,
			};
		},
		props: {
			type: {
				default: 3,
			},
		},
		created() {
			this.isWeixin = sessionStorage.getItem("isWeixin") == "true" ? true : false;
		},
		computed: {
			iswxzf() {
				return this.isWeixin && this.loginType == 1;
			},
		},
		methods: {

			copylink() {
				let link = window.location.href;
				this.$copyText(link).then(
					() => {
						let task = JSON.parse(sessionStorage.getItem("taskInfo")).task;
						forwardRecord({
							id: task.id
						});
						this.closePop();
						this.$toast("链接复制成功，请到微信上粘贴");
					},
					() => {
						this.$toast("复制失败，请重新点击");
					}
				);
			},

			closePop() {
				this.$emit("close");
			},

			openShow() {
				this.isShow = true
				let task = JSON.parse(sessionStorage.getItem("taskInfo")).task;
				forwardRecord({
					id: task.id
				})
			},

			closeShow() {
				this.isShow = false
			},

			wxshare() {

			}
		},
	};
</script>

<style lang="scss" scoped>
	.drawbody {
		width: 100vw;
		height: 100vh;
	}

	.drawbox {
		width: 60vw;
		font-size: 28rpx;
		margin: auto;
	}

	.gginner {
		background-color: white;
		border-radius: 20px;
		padding: 20px;
	}

	.drawimg {
		width: 8rem;
		height: 5.3rem;
		// max-height: 6.8rem;
		margin: auto;

		img {
			width: 100%;
			height: 100%;
		}
	}

	.title {
		color: #76b9fe;
	}

	.detailbtn {
		width: 300rpx;
		height: 60rpx;
		border-radius: 8rpx;
		background: linear-gradient(142deg, #EFB565 0%, #D83626 100%);
		border: 1px solid #fff;
		// background-color: #76B9FE;
		// border: 1px solid #007CFF;
	}

	.detailbtn2 {
		width: 140rpx;
		height: 60rpx;
	}

	.mauto {
		margin: 20rpx auto;
	}

	.zfwrapper {
		position: fixed;
		top: 0;
		left: 0;
		width: 100%;
		height: 100%;
		background: rgba(0, 0, 0, 0.8);
		/* Black background with 0.5 opacity */
		z-index: 9999;

		.zfimg {
			position: absolute;
			top: 30px;
			right: 10%;
			width: 280px;
			height: 230px;
		}
	}

	// .zfwrapper{
	//   position: absolute;
	// }
</style>